<template>
	<s-page>
		<view>
			<!-- 新密码 -->
			<form @submit="respass">
				<view class="NewPass">
					<!-- <text>新的密码</text> -->
					<text>旧的密码</text>
					<!-- <input type="password" name="input" v-model="oldPassword" /> -->
					<uni-easyinput type="password" :styles="styles" name="input" v-model="oldPassword"></uni-easyinput>
				</view>
				<!-- 确认密码 -->
				<view class="RPass">
					<!-- <text>确认密码</text> -->
					<text>新的密码</text>
					<!-- <input type="password" name="input" v-model="password" /> -->
					<!-- <input type="text" name="input" v-model="userName"/> -->
					<uni-easyinput placeholder="密码长度必须为8-16位，同时包含字母和数字" type="password" :styles="styles" name="input"
						v-model="password"></uni-easyinput>
				</view>
				<view class="rePass">
					<text>确认密码</text>
					<uni-easyinput type="password" :styles="styles" name="input" v-model="ConfirmPass"
						v-on:input="checkPass"></uni-easyinput>
				</view>
				<text style="float: right;font-size: 24rpx;color:#F75424 ;">{{tips}}</text>
				<button form-type="submit" class="sub_button">提交</button>
			</form>
		</view>
		<s-popup v-model="autoCloseVisible" animate="zoom-in" position="center" background="#fff" width="400"
			:duration="2000" radius="20">
			<view class="s-popup-view">
				<text class="s-popup-title">{{s_title}}</text>
				<text class="s-popup-main">{{s_errorMsg}}</text>
			</view>
		</s-popup>
	</s-page>
</template>
<script>
	import Dialog from '@/uni_modules/s-ui/utils/dialog'; //弹出框引入
	export default {
		data() {
			return {
				oldPassword: '',
				password: '',
				userName: '',
				ConfirmPass: '',
				tips: '',
				styles: {
					borderColor: '#FFFFFF'
				},
				autoCloseVisible: false, //弹出框
				s_errorMsg: '', //报错提示
				s_title: '', //报错标题
			}
		},
		methods: {
			checkPass() {
				if (this.password != this.ConfirmPass) {
					// console.log("密码不一致")

					this.tips = "确认新密码与新密码不一致"
				} else {
					this.tips = ''
				}
			},
			async doLoginOut() {
				const res = await this
					.$myRequest({
						url: '/api-portal/logout'
					})
				if (res.success == true) {
					//注销后移除app保存的信息
					uni.removeStorageSync('loginName');
					uni.removeStorageSync('id');
					uni.removeStorageSync('x-auth-token');
					uni.removeStorageSync('loginAndReturnPage');
					//移除菜单权限
					uni.removeStorageSync('worker');
					uni.removeStorageSync('nodekeyArr');
					//从涂鸦注销
					const userModule = uni.requireNativePlugin("LJY-UserModule") //调用android中自定义的插件名称
					//执行涂鸦智能注销，不关乎是否注销成功
					userModule.logout();
					uni.removeTabBarBadge({
						index: 1,
					})
					uni.reLaunch({ //关闭当前页面，跳转到应用内的某个页面。
						url: '/pages/user/login/index'
					})
				}
			},
			async respass() { //async 定义的函数会默认的返回一个Promise对象resolve的值
				// console.log("ss")
				var loginName = uni.getStorageSync('loginName')
				this.userName = loginName

				var reg = /^(?![0-9]+$)(?![a-z]+$)(?![A-Z]+$)(?!([^(0-9a-zA-Z)])+$).{8,16}$/;
				if (reg.test(this.password) && this.password === this.ConfirmPass) {
					// console.log(reg.test(this.password))
					const res = await this
						.$myRequest({ //await 关键字 只能放在 async 函数内部， await关键字的作用 就是获取 Promise中返回的内容， 获取的是Promise函数中resolve或者reject的值
							url: '/api-portal/pw/reset/',
							method: "post",
							data: {
								oldPassword: this.oldPassword,
								password: this.password,
								userName: this.userName
							},
						})
					console.log(res)
					let errorMsg = res.msg
					if (res.success == true) { //如果登录成功
						// console.log("修改成功，密码")
						this.s_title = "修改成功"
						this.s_errorMsg = '2秒后跳转至前往登录页'
						this.autoCloseVisible = true
						setTimeout(function() {
							uni.request({
								url: 'http://pm.gxtimeloit.com:10030/api-portal/logout', 
								success: (res) => {
									if (res.code = 100) {
										uni.removeStorageSync('loginName');
										uni.removeStorageSync('id');
										uni.removeStorageSync('x-auth-token');
										uni.removeStorageSync('loginAndReturnPage');
										//移除菜单权限
										uni.removeStorageSync('worker');
										uni.removeStorageSync('nodekeyArr');
										//从涂鸦注销
										const userModule = uni.requireNativePlugin(
											"LJY-UserModule") //调用android中自定义的插件名称
										//执行涂鸦智能注销，不关乎是否注销成功
										userModule.logout();
										uni.removeTabBarBadge({
											index: 1,
										})
										setTimeout(function() {
											uni.reLaunch({ //关闭当前页面，跳转到应用内的某个页面。
												url: '/pages/user/login/index'
											})
										}, 2000)
									}
								}
							})
						}, 2000)
					} else {
						// console.log("ss")
						this.s_title = "修改失败"
						this.s_errorMsg = errorMsg

						this.autoCloseVisible = true
						// uni.showToast({
						// 	title: errorMsg,
						// 	mask: true,
						// 	duration: 2000
						// });
					}
				} else {
					this.autoCloseVisible = true
					this.s_errorMsg = '密码长度必须为8-16位，且必须同时包含字母和数字'
					this.s_title = "修改失败"
					// uni.showToast({
					// 	title: '密码长度必须为8-16位，且必须同时包含字母和数字',
					// 	icon: 'error',
					// 	mask: true,
					// 	duration: 2000
					// });
				}
				// const res = await this
				// 	.$myRequest({ //await 关键字 只能放在 async 函数内部， await关键字的作用 就是获取 Promise中返回的内容， 获取的是Promise函数中resolve或者reject的值
				// 		url: '/api-portal/pw/reset/',
				// 		method: "post",
				// 		data: {
				// 			oldPassword: this.oldPassword,
				// 			password: this.password,
				// 			userName: this.userName
				// 		},
				// 	})
				// if (res.success == true) { //如果登录成功
				// 	console.log("修改成功，密码")
				// 	uni.switchTab({
				// 		url: '/pages/user/index'
				// 	});
				// } else {
				// 	uni.showToast({
				// 		title: '修改失败',
				// 		mask: true,
				// 		duration: 2000
				// 	});
				// }
			},

		}
	}
</script>

<style lang="scss">
	.NewPass,
	.RPass,
	.rePass {
		height: 42px;
		background-color: #FFFFFF;
		margin-top: 10px;
		padding: 0 0 0 30px;

		color: #565656;
		font-size: 13px;
		font-weight: 600;

		display: flex;
		align-items: center;
		flex-direction: row;
	}

	.NewPass text,
	.RPass text,
	.rePass text {
		width: 80px;
	}


	.NewPass input,
	.RPass input,
	.rePass input {
		color: #565656;
		font-size: 13px;
		font-weight: 600;
	}

	/* 	.RPass input {
		color: #565656;
		font-size: 13px;
		font-weight: 600;
	} */

	.sub_button {
		height: 38px;
		width: 90.6%;
		background-color: #109EF8;
		color: #FFFFFF;
		line-height: 38px;
		text-align: center;
		margin: 48px auto 0 auto;
		border-radius: unset;
	}

	.s-popup-view {
		// background-color: #0062CC;
		width: 100%;
		height: 100%;
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;

		.s-popup-title {
			// display: block;
			// position: absolute;
			// top: 30rpx;
			font-size: 38rpx;
			height: 76rpx;
			line-height: 76rpx;
		}

		.s-popup-main {
			font-size: 34rpx;
			margin: 30rpx 30rpx;
			// position: absolute;
			// bottom: 0;
		}

	}
</style>
